﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="CreateMealPlan.aspx.cs" Inherits="CreateMealPlan" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
    <link href="js/validationEngine.jquery.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery.validationEngine.js" type="text/javascript"></script>
    <script src="js/jquery.validationEngine-en.js" type="text/javascript"></script>
<style>
ul.ulimg{margin:0;}
</style>
<script type="text/javascript">
    function loadRecipes() {
        var ReiceIdSession = '<%=Session["RecipeOfMealPlan"]%>';

        if (ReiceIdSession != '') {
            var RecipeIDList = ReiceIdSession.split(',');
            for (var a = 0; a < RecipeIDList.length; a++) {
                if (RecipeIDList[a] != '') {
                    document.getElementById("<% =hdRecipeId.ClientID %>").value = document.getElementById("<% =hdRecipeId.ClientID %>").value + RecipeIDList[a] + ',';
                    $.ajax({
                        type: "POST",
                        url: "PIMService.asmx/GetRecipeUserByRecipe",
                        data: "{'RecipeId':'" + parseInt(RecipeIDList[a], 10) + "'}",
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (response) {
                            //alert(response.d);
                            BindRecipe(response);
                        },
                        error: function (msg) { alert(msg.constructor) }
                    });
                }
            }
        }
    }

    function RemoveIngredient(recipeId) {
        if (confirm('Do you want to remove this Recipe?')) {
            $("#li_" + recipeId + "").remove();
            document.getElementById("<% =hdRecipeId.ClientID %>").value = document.getElementById("<% =hdRecipeId.ClientID %>").value.replace(recipeId + ',', '');
        }
    }

    function BindRecipe(response) {
        var recipe = response.d;
        var html = "";
        //        for (var i = 0; i < recipe.length; i++) {
        var varObjectID = recipe.RecipeID;
        var varObjectName;
        var varObjectNameFull;
        if (recipe.RecipeName != null) {

            varObjectName = recipe.RecipeName.substring(0, 10);
            if (varObjectName.length > 10) varObjectName = varObjectName + ' ..';
            varObjectNameFull = recipe.RecipeName;
        }
        else {
            varObjectName = 'No Name..';
            varObjectNameFull = 'No Name';
        }
        var varObjectImage = recipe.RecipeImage;
        if (varObjectImage != null) {
            var recipeID = varObjectID + ',';

            html += '<li id="li_' + varObjectID + '" class="ui-widget-content ui-corner-tr form-row-image">'
            html += '<a id="' + varObjectID + '" class="none-decoration" ' + varObjectID + '" href="NewRecipe.aspx?RecipeId=' + varObjectID + '" >' + varObjectName + ' </a>';
            html += '<img class="tooltip li-recipe-image" serving="' + 1000 + '" src="../' + varObjectImage + '" onclick="ViewRecipeFullView(' + varObjectID + ')" >';
            html += '<a class="li-icon-right"><img src="images/img05.jpg" alt="" class="li-iconimage-right"  onclick="javascript:RemoveIngredient(' + varObjectID + ');"/>';
            html += '</a>';
            html += '</li>'
        }
        $('#gallery').append(html);
    }

    $(document).ready(function () {
        jQuery(".form").validationEngine({ scroll: false, focusFirstField: false });
        loadRecipes();
    });

    function ViewRecipeFullView(recipeToView) {
        self.location = "NewRecipe.aspx?RecipeId=" + recipeToView + "";
    }

    function goBack() {

        window.history.back();
        return false;
    }

    </script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<section id="bg_content01">
	<h2 style="width:100%;">
        <img src="images/title02.jpg" alt="Create meal Plan" width="127" height="25">
        <div class="box02">
        <ul class="ul04">
          <li>
            <asp:ImageButton ID="imgSave" runat="server" OnClick="btnSave_Click" src="images/btn_save.jpg" alt="" />
          </li>
            <%--<ul class="ulbox" style="margin-right:10px;">
                <li class="li01"><asp:ImageButton ID="imgCancel" runat="server" OnClientClick="return goBack();" Visible="false" OnClick="btnCancel_Click" src="images/btn_cancel.jpg"  /></li>
            </ul>
            <ul class="ulbox">
                <li class="li01"><asp:ImageButton ID="imgSave" runat="server" OnClick="btnSave_Click" src="images/icon04.jpg" alt="" width="28" height="28" /></li>
            </ul>--%>
        </div>
    </h2>	
  	<div class="box01 clearfix clear">
            
            <div class="ip-text"><asp:TextBox ID="txtMealPlanName" runat="server" CssClass="validate[required] input-trpr" placeholder="Meal Plan Name" type="text" value="" ></asp:TextBox></div>
            
            <div class="ip-text"><asp:TextBox ID="txtBasicInfo" runat="server" CssClass="input-trpr" placeholder="Basic Info" type="text" value="" ></asp:TextBox></div>  
            
            <div class="ip-textarea"><asp:TextBox ID="txtDescription" runat="server" CssClass="field-areatbox"  TextMode="MultiLine" placeholder="Description"  type="text" value="" ></asp:TextBox></div>     
               
    </div>
    <div class="clearfix clear">
        <div class="bg01">
        	<div class="bg06">
            	<div class="bg07 clearfix" style="min-height:150px;">
    	            <ul id="gallery" class="ulimg">

                    </ul>
                </div>
            </div>
        </div>
    </div>
</section>

 <asp:HiddenField ID="hdRecipeId" runat="server"></asp:HiddenField>
</asp:Content>

